import './style.scss'
import { Component } from 'react'
import { loginAdmin } from '../../api/admin'
import {message} from 'antd'
import  withRouter  from '../../util/withRouter'
import { connect  } from 'react-redux'
import { setAdminInfo } from '../../store/adminSlice'


class Login extends Component{
    // 受控组件
    state = {
        name:'',
        pwd:''
    };
    handleLogin =  async ()=>{
        // 数据过滤
        if(!this.state.name) return message.info('请填写正确用户名')
        if(!this.state.pwd) return message.info('密码！不填了？？？？')


        // 执行登录
        let res =  await loginAdmin({
            name:this.state.name,
            pwd:this.state.pwd
        })

        console.log('res',res)
        console.log('props' ,  this.props)

        this.props.dispatch(setAdminInfo(res.data))  // 全局设置adminInfo

        message.info('登录成功')
        // 重定向到 /index
        this.props.navigate('/index',{replace:true})
     
    }
    render(){
    return (
        <div className='loginPage'>
          <div className='loginbox'>
            <div>
                <input placeholder='请输入账号' value={this.state.name} onChange={ ev=>this.setState({name:ev.target.value}) }/>
            </div>
            <div>
                <input placeholder='请输入密码' value={this.state.pwd} onChange={ ev=>this.setState({pwd:ev.target.value}) }/>
            </div>
            <div>
                <button onClick={ this.handleLogin }>立即登录</button>
            </div>
          </div>
        </div>
    )
 }
}



const mapStateToProps = (state)=>({...state})
export default connect(mapStateToProps)(withRouter(Login));